<template>
  <div class="hello">
    <h1>SQL语法转换器V0.5.1 测试版</h1>
    <div class="title_history">
      <div class="select-container">
        <span class="label-text">当前需要转换的SQL语法格式为：</span>
        <el-select v-model="value" placeholder="请选择">
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
      </div>
      <el-button class="button_history" type="info" @click="drawer = true"
        >版本信息</el-button
      >
    </div>
    <el-drawer title="历史更新记录" :visible.sync="drawer" :with-header="true" size="30%">
      <div>
      <el-timeline :reverse="reverse">
        <el-timeline-item
          v-for="(activity, index) in activities"
          :key="index"
          :timestamp="activity.timestamp"
        >
          {{ activity.content }}
        </el-timeline-item>
      </el-timeline>
      </div>
    </el-drawer>
    <el-input
      class="input_text"
      type="textarea"
      :rows="15"
      placeholder="请输入内容"
      v-model="textarea1"
    >
    </el-input>
    <el-button class="btn_zhuan" type="primary" @click="sqlChange(value)"
      >开始转换</el-button
    >
    <el-button class="btn_zhuan" type="primary" @click="upChange"
      >全大写</el-button
    >
    <el-input
      class="input_text"
      type="textarea"
      :autosize="{ minRows: 4 }"
      placeholder="此处显示结果"
      v-model="textarea2"
    >
    </el-input>
  </div>
 
</template>

<script>
export default {
  name: "HelloWorld",
  data() {
    return {
      drawer: false,
      reverse: false,
      activities: [
        {
          content: "v0.5.1 beta 添加对百度页面统计的支持",
          // timestamp: "2018-04-15",
        },
        {
          content: "v0.5 beta DB2模式下正常识别表别名",
          // timestamp: "2018-04-15",
        },
        {
          content: "v0.4 beta 添加对DB2转PostgreSQL支持",
          // timestamp: "2018-04-15",
        },
        {
          content: "v0.3 beta 修改转换BUG，可初步使用",
          // timestamp: "2018-04-15",
        },
        {
          content: "v0.2 beta 添加对Hive转PostgreSQL支持",
          // timestamp: "2018-04-13",
        },
        {
          content: "v0.1 项目初始化",
          // timestamp: "2018-04-11",
        },
      ],
      value: "DB2",
      textarea1: "",
      textarea2: "",
      options: [
        {
          value: "Hive",
          label: "Hive",
        },
        {
          value: "DB2",
          label: "DB2",
        },
      ],
    };
  },
  methods: {
    sqlChange(e) {
      switch (e) {
        case "Hive":
          this.zhuanHuanHive();
          break;
        case "DB2":
          this.zhuanhuanDb2();
          break;
      }
    },

    // 转换DB2语法
    zhuanhuanDb2() {
      let a = this.textarea1;
      a = a.toUpperCase();

      const OBJ = [
        { name: /\t/g, value: "" },
        { name: /SELECT/g, value: "SELECT\n" },
        { name: /FROM/g, value: "FROM\n" },
        { name: /WHERE/g, value: "WHERE\n" },
      ];

      OBJ.forEach((item) => {
        a = a.replace(item.name, item.value);
      });

      // 处理select和from之间的语句
      let words1 = [];
      words1 = a.split("FROM");

      let tempa = [];
      words1[0].split("\n").forEach((item) => {
        item = item.trim();
        // 处理字段
        if (
          item != "" &&
          item != " " &&
          item != " " &&
          item != "\n" &&
          item != "\t" &&
          item != null &&
          item != undefined &&
          item != "SELECT"
        ) {
          for (let v of item) {
            if (v == "" && v == " ") {
              v = '" "';
            }
            if (v == ",") {
              v = '",';
            }
            tempa.push(v);
          }
        }
      });
      for (let i = 0; i < tempa.length; i++) {
        // 识别字段翻译
        if (tempa[i].match(/[\u4e00-\u9fa5]+/)) {
          if (
            tempa[i - 1].match(/[A-Z]+/g) ||
            tempa[i - 1] == " " ||
            tempa[i - 1] == ""
          ) {
            tempa[i] = ' "' + tempa[i];
          }
        }
        if (tempa[i].match(/[A-Za-z]+/)) {
          if (tempa[i - 1] == " " || tempa[i - 1] == "") {
            tempa[i] = ' "' + tempa[i];
          }
        }
        // 针对英文字段与中文翻译之间，靠近英文侧处理
        if (tempa[i] == " " || tempa[i] == "" || tempa[i] == "\t") {
          if (tempa[i - 1].match(/[A-Z]/g) || tempa[i - 1].match(/[0-9]/g)) {
            tempa[i - 1] = tempa[i - 1] + '"';
          }
        }
        // 如果有.进行处理
        if (tempa[i] == ".") {
          tempa[i] = tempa[i] + '"';
        }
        // console.log(tempa[i]);
      }
      // 字符数组转换回字符串
      // console.log(tempa);
      let tempb = tempa.join("") + '"';
      tempb = tempb.replace(/,/g, ",\n");

      // console.log(tempb);

      // 处理表名
      let bieming = "";
      let words2 = words1[1].split("WHERE");
      let biao = words2[0].trim();
      biao = biao.replace(/DB./, "audit.") + '"';
      let tempd = [];
      for (let v of biao) {
        tempd.push(v);
      }
      for (let i = 0; i < tempd.length; i++) {
        if (tempd[i] == ".") {
          tempd[i] = '."';
        }
        if (tempd[i].match(/[A-Z]/g) && tempd[i - 1] == ".") {
          tempd[i] = '"' + tempd[i];
        }
        if (tempd[i].match(/[A-Z]/g) && tempd[i + 1] == " ") {
          tempd[i] = tempd[i] + '"';
        }
        if (tempd[i].match(/[0-9]/g) && tempd[i + 1] == " ") {
          tempd[i] = tempd[i] + '"';
        }
        // 如果有别名，进行处理
        // if (tempd[i].match(/[A-Z]/g) && tempd[i - 1] == " ") {
        //   tempd[i] = '"' + tempd[i];
        // }
      }
      biao = tempd.join("");
      biao = biao.replace(/\"AS\"/, "AS");

      // 获取别名
      let t = [];
      console.log(biao);
      console.log(biao.split("AS"));
      t = biao.split("AS");
      if (t.length > 1) {
        bieming = t[t.length - 1].replace(/\"/g, "").trim();
      } else if (biao.split(" ").length > 1) {
        let t1 = biao.split(" ");
        bieming = t1[t1.length - 1];
      }

      // console.log(t);

      // 处理where条件
      // todo

      // 处理字段
      let res = "";
      console.log("bieming = " + bieming);
      if (
        bieming != undefined &&
        bieming != "" &&
        bieming != null &&
        bieming != " "
      ) {
        console.log(1);
        console.log("tempb = " + tempb);
      } else {
        console.log(2);
        tempb = '"' + tempb.replace(/\n/g, '\n"');
      }

      res = "SELECT\n" + tempb + "\nFROM\n" + biao;
      // 处理select * 的情况
      res = res.replace(/\"\*\"/g, "*");
      // console.log(tempb);
      this.textarea2 = res;
    },

    // 转换Hive语法
    zhuanHuanHive() {
      let a = this.textarea1;
      a = a.toUpperCase();

      const OBJ = [
        { name: /  /g, value: "" },
        { name: /\t/g, value: "" },
        { name: /`/g, value: '" "' },
        { name: / ",/g, value: "," },
        { name: /NSPLATFORM/g, value: "AUDIT" },
        { name: /GROUPBY/g, value: "GROUP BY" },
        { name: /ISNOTNULL/g, value: " IS NOT NULL " },
        { name: /ISNULL/g, value: " IS NULL " },
        { name: /AND/g, value: " AND " },
        { name: /OR/g, value: " OR " },
        { name: /ORDERBY/g, value: "OR DER BY" },
        { name: /!/g, value: " !" },
        { name: /<>/g, value: " <> " },
        { name: /=/g, value: "= " },
        { name: /LIKE/g, value: " LIKE " },
        { name: /JOIN/g, value: " JOIN " },
        { name: /LEFTJOIN/g, value: "LEFT join " },
        { name: /RIGHTJOIN/g, value: "RIGHT JOIN " },
        { name: /INNERJOIN/g, value: "INNER JOIN " },
        { name: /HAVING/g, value: "HAVING " },
      ];

      OBJ.forEach((item) => {
        a = a.replace(item.name, item.value);
      });

      // 处理select - from 之间的数据
      let words1 = [];
      words1 = a.split("FROM");

      let words2 = [];
      words2 = words1[0].split("SELECT");
      let words21 = [];
      words2[1].split("\n").forEach((item) => {
        if (item != " " && item != "\n" && item != "\t") {
          words21.push(item);
        }
      });

      let bb = "";
      for (let index = 0; index < words21.length; index++) {
        if (words21[index] != "") {
          bb += '\t"' + words21[index] + "\n";
        }
      }
      bb = bb.substring(0, bb.length - 2) + "\n";
      bb = bb.replace(/"CASE WHEN/g, "CASE WHEN");
      bb = bb.replace(/"WHEN /g, "WHEN ");
      bb = bb.replace(/"ELSE /g, "ELSE ");
      bb = bb.replace(/"END /g, "END ");
      bb = bb.replace(/ " "/g, '" "');

      // 处理表名
      let words3 = [];
      words1[1].split("\n").forEach((item) => {
        if (item != " ") {
          words3.push(item);
        }
      });
      console.log(words3);
      words3[0] = words3[0].replace(/AUDIT./, 'audit."') + '"';

      let cc = "";
      for (let index = 0; index < words3.length; index++) {
        if (words3[index] != "") {
          cc += words3[index] + "\n";
        }
      }

      this.textarea2 = "SELECT\n" + bb + "FROM\n" + cc;
    },

    // 大写转换
    upChange() {
      this.daxie(this.textarea1);
    },

    daxie(params) {
      this.textarea2 = params.toUpperCase();
    },
  },
};
</script>


<style scoped>
.hello {
  padding: 0 8%;
}

.title_history {
  display: flex;
  justify-content: space-between;
}

.select-container {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}

.button_history {
  float: right;
  margin: 0 0 20px 0;
}

.label-text {
  font-size: 20px;
}

.btn_zhuan {
  margin-bottom: 20px;
}

.input_text {
  margin-bottom: 20px;
}
</style>
